<template>
  <n-space :vertical="true" :size="16">
    <top-chart v-if="Object.keys(chartData).length > 0" :data="chartData" />
    <data-card v-if="Object.keys(cardData).length > 0" :data="cardData" />
    <bottom-part v-if="Object.keys(listData).length > 0" :data="listData" />
  </n-space>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import { request } from '@/service/request';
import { BottomPart, DataCard, TopChart } from './components';
const chartData = ref({});
const cardData = ref({});
const listData = ref({});

// 初始数据
async function init() {
  const { data } = await request.get(`/analysis`);
  if (data) {
    chartData.value = {
      users: data.users,
      series: data.series
    };
    cardData.value = {
      visitorCnt: data.visitorCnt,
      volume: data.volume,
      coinCnt: data.coinCnt,
      likeSum: data.likeSum
    };
    listData.value = {
      recentPayment: data.recentPayment,
      versionHis: data.versionHis
    };
  }
}
init();
</script>

<style scoped></style>
